import {Clone,useGLTF,OrbitControls} from "@react-three/drei";
import {Perf} from "r3f-perf";
import {CuboidCollider, Debug, RigidBody, Physics, CylinderCollider} from "@react-three/rapier";
import {useEffect, useRef} from "react";



const Car=()=>{
    const carrun=useRef()
    const car = useGLTF('/src/assets/three3D/model.gltf')
    useEffect(()=>{
        console.log(carrun.current)
        window.addEventListener('keyup',(e)=>{
            if(e.keyCode===38){
                carrun.current.applyImpulse({x:0,y:0,z:5})
            }else if(e.keyCode===40){
                carrun.current.applyImpulse({x:0,y:0,z:-5})
            }
        })
    },[])
    return(
        <>
            <Perf position='top-left' />
            {/*控制屏幕移动放大缩小*/}
            <OrbitControls makeDefault/>

            <directionalLight position={[1,2,3]} intensity={1.5}/>
            <ambientLight intensity={0.5}/>

            <Physics>
                <Debug />
                <RigidBody colliders='hull' includeInvisible ref={carrun}>
                    <primitive object={car.scene} scale={0.1}></primitive>
                    {/*<CylinderCollider args={[0.5,1.25]} />*/}
                </RigidBody>
                <RigidBody type='fixed'>
                    <mesh receiveShadow position-y={-1.25}>
                        <boxGeometry  args={[20,0.5,20]}/>
                        <meshStandardMaterial color='lightskyblue' />
                    </mesh>
                </RigidBody>
                {/*添加围墙*/}
                <RigidBody type='fixed' >
                    <CuboidCollider args={[5,2,0.5]} position={[0,1,5.5]} />
                    <CuboidCollider args={[5,2,0.5]} position={[0,1,-5.5]} />
                    <CuboidCollider args={[0.5,2,5]} position={[5.5,1,0]} />
                    <CuboidCollider args={[0.5,2,5]} position={[-5.5,1,0]} />
                </RigidBody>
            </Physics>
        </>
    )
}
export default Car
